import React, { useEffect, useMemo, useState } from 'react';
import TableHeader from '../../../component/TableHeader';
import '../../../style/fullcard.scss';
import { Table } from 'antd';
import { sale_data, sale_data_feng } from '../../../utils/sale'
function Fullcard(props) {
    var [data, setData] = useState([])
    var [pagination, setPagination] = useState({ current: 1, pageSize: 6, total: 50 })
    var [peoplenum, setPeoplenum] = useState()

    const columns = [
        {
            title: '日期',//表格列的名字(显示在表格头上)
            dataIndex: 'time',//数据对应的属性名
            // key: 'name' //key是必须的,每一列不同.
        },
        {
            title: '领取人数',
            dataIndex: 'peoplenum',


        },
        {
            title: '领取张数',
            dataIndex: 'pullnum',

        },
        {
            title: '使用人数',
            dataIndex: 'usepeople',

        },
        {
            title: '使用张数',
            dataIndex: "usepull",
        },
    ]
    useEffect(() => {
        sale_data().then((res) => {
            setData(res.data)
        })

    }, [])
    const handlechange = (pagination) => {
        setPagination(pagination)
        sale_data_feng({ _page: pagination.current, _limit: pagination.pageSize }).then((res) => {
            sale_data().then((res) => {
                setData(res.data)
            })
        })
    }
    var handleclick = () => {
        var count = 0
        data.map((item) => {
            return count += item.peoplenum
        })
        console.log(count);
        setPeoplenum(count)
    }
    return (
        <div className='fullcard'>
            <TableHeader header={"营销 / 优惠数据"} name={"优惠数据"}></TableHeader>
            <div className="banner">
                <div className="box" onClick={() => { handleclick() }}>
                    <p>领取张数</p>
                    <p className='num'>{peoplenum}</p>
                </div>

                <div className="box">
                    <p>领取人数</p>
                    <p className='num'>77</p>
                </div>
                <div className="box">
                    <p>使用张数</p>
                    <p className='num'>328</p>
                </div>
                <div className="box">
                    <p>使用数</p>
                    <p className='num'>125</p>
                </div>

            </div>
            <div className='pull'>
                <p className='name'>优惠券领取/使用报表</p>
                <Table columns={columns} dataSource={data} pagination={pagination} onChange={handlechange}></Table>
            </div>
        </div>
    );
}

export default Fullcard;